<template>
  <page-header-wrapper>
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
        <a-form layout="inline">
          <a-row :gutter="24">
            <a-col :md="4" :sm="24">
              <a-form-item>
                <a-input placeholder="收件人姓名/手机号/订单号" v-model="queryParam.search" />
              </a-form-item>
            </a-col>
            <a-col :md="4" :sm="24">
              <span class="table-page-search-submitButtons">
                <a-button type="primary" @click="handleSearch(true)" icon="search">查询</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <s-table
        ref="table"
        size="default"
        rowKey="id"
        :columns="columns"
        :data="loadData"
        :pagination="pagination"
      >
        <a-badge
          :status="orderStatus(text)"
          :text="text | statusFilter"
          slot="status"
          slot-scope="text"
        />
        <a-badge
          :status="groupStatus(text)"
          :text="text | groupFilter"
          slot="is_group"
          slot-scope="text"
        />
        <span slot="action" slot-scope="text, record">
          <template>
            <a @click="handleEdit(record)">详情</a>
          </template>
        </span>
      </s-table>
    </a-card>
  </page-header-wrapper>
</template>

<script>
import { groupBuyOrderList } from '@/api/groupBuy'
import groupStatus from '@/mixins/groupOrderStatus'
import formTableMixin from '@/mixins/formTableMixin'

const columns = [
  {
    title: '名称',
    dataIndex: 'name'
  },
  {
    title: '支付价格',
    dataIndex: 'price',
    customRender (text) {
      return '￥' + text
    }
  },
  {
    title: '数量',
    dataIndex: 'num'
  },
  {
    title: '姓名',
    dataIndex: 'serve_name'
  },
  {
    title: '手机号',
    dataIndex: 'serve_mobile'
  },
  {
    title: '服务地址',
    dataIndex: 'serve_address'
  },
  {
    title: '订单号',
    dataIndex: 'out_trade_no'
  },
   {
    title: '下单时间',
    dataIndex: 'ctime'
  },
  {
    title: '订单状态',
    dataIndex: 'status',
    scopedSlots: { customRender: 'status' }
  },
  {
    title: '拼团状态',
    dataIndex: 'is_group',
    scopedSlots: { customRender: 'is_group' }
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '10%',
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  name: 'GoodsOrderList',
  mixins: [groupStatus, formTableMixin],
  data () {
    this.columns = columns
    this.listAction = groupBuyOrderList
    return {
    }
  },
  methods: {
    handleEdit (record) {
      this.$router.push({
        name: 'groupBuyOrderDetail',
        params: {
          id: record.id
        }
      })
    }
  }
}
</script>
